<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
		<title>供应商系统</title>
		<link rel="stylesheet" href="/Public/css/style.css" />
		<style>
			html{
				width: 100%;
				height: 100%;
			}
			body {			   
			    font-family: 'PT Sans', Helvetica, Arial, sans-serif;
			    text-align: center;
			    color: #fff;
			    background: url(/Public/img/2.jpg) no-repeat;
			    background-size: cover;
			    height: 100%;
			    width: 100%;
			    overflow: hidden;
			}
			.page-container {
			    margin: 120px auto 0 auto;
			}
			h1 {
		    font-size: 30px;
		    font-weight: 700;
		    text-shadow: 0 1px 4px rgba(0,0,0,.2);
			}
		.form {
		    position: relative;
		    width: 305px;
		    margin: 15px auto 0 auto;
		    text-align: center;
		}
		input {
		    width: 270px;
		    height: 42px;
		    margin-top: 25px;
		    padding: 0 15px;
		    background: #2d2d2d;
		    background: rgba(45,45,45,.15);
		    -moz-border-radius: 6px;
		    -webkit-border-radius: 6px;
		    border-radius: 6px;
		    border: 1px solid #3d3d3d;
		    border: 1px solid rgba(255,255,255,.15);
		    -moz-box-shadow: 0 2px 3px 0 rgba(0,0,0,.1) inset;
		    -webkit-box-shadow: 0 2px 3px 0 rgba(0,0,0,.1) inset;
		    box-shadow: 0 2px 3px 0 rgba(0,0,0,.1) inset;
		    font-family: 'PT Sans', Helvetica, Arial, sans-serif;
		    font-size: 14px;
		    color: #fff;
		    text-shadow: 0 1px 2px rgba(0,0,0,.1);
		    -o-transition: all .2s;
		    -moz-transition: all .2s;
		    -webkit-transition: all .2s;
		    -ms-transition: all .2s;
		}
		input:focus {
		    outline: none;
		    -moz-box-shadow: 0 2px 3px 0 rgba(0,0,0,.1) inset, 0 2px 7px 0 rgba(0,0,0,.2);
		    -webkit-box-shadow: 0 2px 3px 0 rgba(0,0,0,.1) inset, 0 2px 7px 0 rgba(0,0,0,.2);
		    box-shadow: 0 2px 3px 0 rgba(0,0,0,.1) inset, 0 2px 7px 0 rgba(0,0,0,.2);
		}
		button {
		    cursor: pointer;
		    width: 300px;
		    height: 44px;
		    margin-top: 25px;
		    padding: 0;
		    background: #ef4300;
		    -moz-border-radius: 6px;
		    -webkit-border-radius: 6px;
		    border-radius: 6px;
		    border: 1px solid #ff730e;
		    -moz-box-shadow: 0 15px 30px 0 rgba(255,255,255,.25) inset, 0 2px 7px 0 rgba(0,0,0,.2);
		    -webkit-box-shadow: 0 15px 30px 0 rgba(255,255,255,.25) inset, 0 2px 7px 0 rgba(0,0,0,.2);
		    box-shadow: 0 15px 30px 0 rgba(255,255,255,.25) inset, 0 2px 7px 0 rgba(0,0,0,.2);
		    font-family: 'PT Sans', Helvetica, Arial, sans-serif;
		    font-size: 14px;
		    font-weight: 700;
		    color: #fff;
		    text-shadow: 0 1px 2px rgba(0,0,0,.1);
		    -o-transition: all .2s;
		    -moz-transition: all .2s;
		    -webkit-transition: all .2s;
		    -ms-transition: all .2s;
		    font-size: 18px;
		}
		.error{
			color: red;
			text-align: center;
			margin-top: 25px;
		}
	　　::-moz-placeholder { color: #FFF; }
		::-webkit-input-placeholder { color:#FFF; }
		:-ms-input-placeholder { color:#FFF; }
		</style>
	</head>
	<body>
		<div class="page-container">
			<h1>供应商系统登录</h1>
			<div class="from">
				<input type="text" id="user" placeholder="用户名"/>
				<input type="password" id="pass" placeholder="密码"/>
				<button id="sub">登录</button>
				<div class="error"></div>
			</div>
		</div>
		<script src="/Public/js/jquery-2.1.0.js"></script>
		<script>
			$("input").focus(function(){
				$(".error").text("");
			});
			$("#sub").click(function(){
				if($("#user").val()&&$("#pass").val()){
					$.ajax({
						type:"post",
						url:"/login/dologin",
						data:{
							user:$("#user").val(),
							pass:$("#pass").val()
						},
                        dataType:'json',
						success:function(res){
						    console.log(res['error']);
						    if(res['error']){
						        alert(res['error']);
						        return;
                            }
							window.location.reload();
						},
						error:function(res){
                            console.log(res.sign);
							$(".error").text("提交失败");
						},
						async:true
					});
					$("#user").val('');
					$("#pass").val('');
				}else{
					$(".error").text("账号密码不能为空");
				}
			});
		</script>
	</body>
</html>
